<template>
    <div class="real-time-display">
        <form id="realTimeForm" ref="realTimeForm">
            <div class="inverter-status-box" v-if='form.inverterStatus==6 || form.inverterStatus==7'>{{$t('report.inverterStatue')}}:{{inverterStatusFormatter(form.inverterStatus)}}</div>
			<div class="modal-content-picshow" :class="{'noPv':calc.wMachineStyle==1}" style="position: relative;">
				<!-- 能量流动线条 -->
				<div class="power-gif pv-gif" id="pv-gif" v-show="gif.pv"></div>
				<div class="power-gif battery-gif" :class="{'up':gif.battery<0}" v-show="gif.battery!=0&&gif.battery!=null"></div>
				<div class="power-gif meter-gif" :class="{'up':gif.meter>0}" v-show="gif.meter!=0"></div>
				<!-- 并网 -->
				<!-- <div class="power-gif grid-gif-all" :class="{'up':1}" v-show="gif.grid1!=0"></div> -->
				<div class="power-gif grid-gif-1" :class="{'left':gif.grid1<0}" v-show="gif.grid1!=0"></div>
				<div class="power-gif grid-gif-2" :class="{'left':gif.grid2<0}" v-show="gif.grid2!=0"></div>
				<div class="power-gif load-gif" :class="{'up':gif.load<0}" v-show="gif.load!=0"></div>
				
				<!-- 页面提示 -->
                <el-tooltip class="prompt" :content="$t('device.display.importantNode')" placement="right">
                    <i class="el-icon-warning"></i>
                </el-tooltip>

                
				<div class="modal-box-12">
                    <!--光伏组件-->
					<div id="pvPart" v-show="calc.wMachineStyle!=1">
						<div id="pvImg" class="real-img pvImg">
							<img src="../../assets/img/realtime/pv.png">
						</div>
						<fieldset id="box-pv-2" class="modal-set-info pv-file-one" v-show="type.pvCount==2">
                            <legend>{{$t('devicd.display.pv_array')}}</legend>
							<table class="pv">
								<tbody>
									<tr>
										<td>
                                            <div class="td-label">{{$t('device.inverter_pv1_voltage')}}</div>
                                        </td>
										<td class="input-right">
                                            <input readonly name="vdc1" :value="form.vdc1"><label>V</label>
                                        </td>
									</tr>
									<tr>
										<td><div class="td-label">{{$t('device.inverter_pv1_current')}}</div></td>
										<td class="input-right">
                                            <input readonly name="idc1" :value="form.idc1"><label>A</label>
                                        </td>
									</tr>
									<tr>
										<td><div class="td-label">{{$t('device.inverter_PV1_input_power')}}</div></td>
										<td class="input-right">
                                            <input readonly name="powerdc1" :value="form.powerdc1"><label>W</label>
                                        </td>
									</tr>
									<tr v-show="pv1Num!=''">
										<td><div class="td-label">{{$t('device.inverter_PV1_counts')}}</div></td>
										<td class="input-right">
                                            <input readonly name="pv1Num" :value="pv1Num">
                                        </td>
									</tr>
								</tbody>
							</table>
							<table class="pv">
								<tbody>
									<tr>
										<td><div class="td-label">{{$t('device.inverter_PV2_voltage')}}</div></td>
										<td class="input-right">
                                            <input readonly name="vdc2" :value="form.vdc2"><label>V</label>
                                        </td>
									</tr>
									<tr>
										<td><div class="td-label">{{$t('device.inverter_PV2_current')}}</div></td>
										<td class="input-right">
                                            <input readonly name="idc2" :value="form.idc2"><label>A</label>
                                        </td>
									</tr>
									<tr>
										<td><div class="td-label">{{$t('device.inverter_PV2_input_power')}}</div></td>
										<td class="input-right">
                                            <input readonly name="powerdc2" :value="form.powerdc2"><label>W</label>
                                        </td>
									</tr>
									<tr v-show="pv2Num!=''">
										<td><div class="td-label">{{$t('device.inverter_PV2_counts')}}</div></td>
										<td class="input-right">
                                            <input readonly name="pv2Num" :value="pv2Num"></td>
									</tr>
								</tbody>
							</table>
						</fieldset>
						<fieldset id="box-pv-4" class="modal-set-info pv-file-one box-pv-4" :class="type.pvCount==3?'pv3':''"  v-show="type.pvCount==3||type.pvCount==4 ||type.pvCount > 4">
                            <legend>{{$t('devicd.display.pv_array1')}}</legend>
							<table class="pv">
								<tbody>
									<tr>
										<td><div class="td-label">{{$t('device.inverter_pv1_voltage')}}</div></td>
										<td class="input-right">
                                            <input readonly name="vdc1" :value="form.vdc1"><label>V</label>
                                        </td>
									</tr>
									<tr>
										<td><div class="td-label">{{$t('device.inverter_pv1_current')}}</div></td>
										<td class="input-right">
                                            <input readonly name="idc1" :value="form.idc1"><label>A</label>
                                        </td>
									</tr>
									<tr>
										<td><div class="td-label">{{$t('device.inverter_PV1_input_power')}}</div></td>
										<td class="input-right">
                                            <input readonly name="powerdc1" :value="form.powerdc1"><label>W</label>
                                        </td>
									</tr>
									<tr v-show="pv1Num!=''">
										<td><div class="td-label">{{$t('device.inverter_PV1_counts')}}</div></td>
										<td class="input-right">
                                            <input readonly name="pv1Num" :value="pv1Num"></td>
									</tr>
								</tbody>
							</table>
							<table class="pv">	
								<tbody> 
									<tr>
										<td><div class="td-label">{{$t('device.inverter_PV2_voltage')}}</div></td>
										<td class="input-right">
                                            <input readonly name="vdc2" :value="form.vdc2"><label>V</label>
                                        </td>
									</tr>
									<tr>
										<td><div class="td-label">{{$t('device.inverter_PV2_current')}}</div></td>
										<td class="input-right">
                                            <input readonly name="idc2" :value="form.idc2"><label>A</label>
                                        </td>
									</tr>
									<tr>
										<td><div class="td-label">{{$t('device.inverter_PV2_input_power')}}</div></td>
										<td class="input-right">
                                            <input readonly name="powerdc2" :value="form.powerdc2"><label>W</label>
                                        </td>
									</tr>
									<tr v-show="pv2Num!=''">
										<td><div class="td-label">{{$t('device.inverter_PV2_counts')}}</div></td>
										<td class="input-right">
                                            <input readonly name="pv2Num" :value="pv2Num"></td>
									</tr>
								</tbody>
								</table>
							<table class="pv" v-show='!(type.inverterType == 13 && japanDataList.ratedPower == 3)'>
								<tbody>
									<tr>
										<td><div class="td-label">{{$t('device.inverter_PV3_voltage')}}</div></td>
										<td class="input-right">
                                            <input readonly name="vdc3" :value="form.vdc3"><label>V</label>
                                        </td>
									</tr>
									<tr>
										<td><div class="td-label">{{$t('device.inverter_PV3_current')}}</div></td>
										<td class="input-right">
                                            <input readonly name="idc3" :value="form.idc3"><label>A</label>
                                        </td>
									</tr>
									<tr>
										<td><div class="td-label">{{$t('device.inverter_PV3_input_power')}}</div></td>
										<td class="input-right">
                                            <input readonly name="powerdc3" :value="form.powerdc3"><label>W</label>
                                        </td>
									</tr>
								</tbody>
							</table>
							<table class="pv" v-show="type.pvCount!=3">
								<tbody>
									<tr>
										<td><div class="td-label">{{$t('device.inverter_PV4_voltage')}}</div></td>
										<td class="input-right">
                                            <input readonly name="vdc4" :value="form.vdc4"><label>V</label>
                                        </td>
									</tr>
									<tr>
										<td><div class="td-label">{{$t('device.inverter_PV4_current')}}</div></td>
										<td class="input-right">
                                            <input readonly name="idc4" :value="form.idc4"><label>A</label>
                                        </td>
									</tr>
									<tr>
										<td><div class="td-label">{{$t('device.inverter_PV4_input_power')}}</div></td>
										<td class="input-right">
                                            <input readonly name="powerdc4" :value="form.powerdc4"><label>W</label>
                                        </td>
									</tr>
								</tbody>
							</table>
                            <!-- v-if='type.pvCount>4' -->
                            <a href="javascript:;" class="detail-pv-modal-show" v-if='type.pvCount >= 4' @click='showPvModal(form,type)'>{{$t('alarmRecordInfo.title')}}>></a>
						</fieldset>
						<img alt="pic" class="real-line pv-img-two" v-show="type.pvCount!=0" src="../../assets/img/realtime/lin3.png">
					</div>
                    
                    <!--逆变器输出电压、电流、功率-->
					<div style="position: absolute;">
						<fieldset id="box-ic-1" class="modal-set-info main-file-one line-bottom" v-show="phaseType==1">
                            <legend>{{$t('devicd.display.Mains')}}</legend>
							<table>
								<tbody>
									<tr>
										<td><div class="td-label">{{$t('device.inverter_Grid_voltage')}}</div></td>
										<td class="input-right">
                                            <input readonly name="vac1" :value="form.inverterStatus==6 || form.inverterStatus==7?form.epsVoltageA?form.epsVoltageA:0: form.vac1"><label>V</label>
                                        </td>
									</tr>
									<tr>
										<td><div class="td-label">{{$t('device.inverter_output')}}</div></td>
										<td class="input-right">
                                            <input readonly name="iac1" :value="form.inverterStatus==6 || form.inverterStatus==7?form.epsCurrentA?form.epsCurrentA:0:form.iac1"><label>A</label>
                                        </td>
									</tr>
									<tr>
										<td><div class="td-label">{{$t('device.inverter_real_time.pac')}}</div></td>
										<td class="input-right">
                                            <input readonly name="pac1" :value="form.inverterStatus==6 || form.inverterStatus==7?form.epsApowerActive?form.epsApowerActive:0:form.pac1"><label>W</label>
                                        </td>
									</tr>
								</tbody>
							</table>
						</fieldset>
						<fieldset id="box-ic-3" class="modal-set-info main-file-two line-bottom" :class="type.inverterType==13?'japan':''" v-show="phaseType==3||type.inverterType==13">
                            <legend>{{$t('devicd.display.Mains')}}</legend>
							<table class="ic">
								<tr>
									<td><div class="td-label">{{$t('device.inverter_Grid_voltage')}}{{$t('1')}}</div></td>
									<td class="input-right">
                                        <input readonly name="vac1" :value="form.inverterStatus==6 || form.inverterStatus==7?form.epsVoltageA?form.epsVoltageA:0:form.vac1"><label>V</label>
                                    </td>
								</tr>
								<tr>
									<td><div class="td-label">{{$t('device.inverter_output')}}{{$t('1')}}</div></td>
									<td class="input-right">
                                        <input readonly name="iac1" :value="form.inverterStatus==6 || form.inverterStatus==7?form.epsCurrentA?form.epsCurrentA:0:form.iac1"><label>A</label>
                                    </td>
								</tr>
								<tr >
									<td><div class="td-label">{{$t('device.inverter_real_time.pac')}}{{$t('1')}}</div></td>
									<td class="input-right">
                                        <input readonly name="pac1" :value="form.inverterStatus==6 || form.inverterStatus==7?form.epsApowerActive?form.epsApowerActive:0:form.pac1"><label>W</label>
                                    </td>
								</tr>
							</table>
							<table class="ic">
								<tr>
									<td><div class="td-label">{{$t('device.inverter_Grid_voltage')}}{{$t('2')}}</div></td>
									<td class="input-right">
                                        <input readonly id="vac2" name="vac2" :value="form.inverterStatus==6 || form.inverterStatus==7?form.epsVoltageB?form.epsVoltageB:0:form.vac2"><label>V</label>
                                    </td>
								</tr>	
								<tr>
									<td><div class="td-label">{{$t('device.inverter_output')}}{{$t('2')}}</div></td>
									<td class="input-right">
                                        <input readonly id="iac2" name="iac2" :value="form.inverterStatus==6 || form.inverterStatus==7?form.epsCurrentB?form.epsCurrentB:0:form.iac2"><label>A</label>
                                    </td>
								</tr>
								<tr>
									<td><div class="td-label">{{$t('device.inverter_real_time.pac')}}{{$t('2')}}</div></td>
									<td class="input-right">
                                        <input readonly id="pac2" name="pac2" :value="form.inverterStatus==6 || form.inverterStatus==7?form.epsBpowerActive?form.epsBpowerActive:0:form.pac2"><label>W</label>
                                    </td>
								</tr>	
							</table>	
							<table class="ic" v-show="type.inverterType!=13">
								<tr>
									<td><div class="td-label">{{$t('device.inverter_Grid_voltage')}}{{$t('3')}}</div></td>
									<td class="input-right">
                                        <input readonly id="vac3" name="vac3" :value="form.inverterStatus==6 || form.inverterStatus==7?form.epsVoltageC?form.epsVoltageC:0:form.vac3"><label>V</label>
                                    </td>
								</tr>	
								<tr>	
									<td><div class="td-label">{{$t('device.inverter_output')}}{{$t('3')}}</div></td>
									<td class="input-right">
                                        <input readonly id="iac3" name="iac3" :value="form.inverterStatus==6 || form.inverterStatus==7?form.epsCurrentC?form.epsCurrentC:0:form.iac3"><label>A</label>
                                    </td>
								</tr>
								<tr>
									<td><div class="td-label">{{$t('device.inverter_real_time.pac')}}{{$t('3')}}</div></td>
									<td class="input-right">
                                        <input readonly id="pac3" name="pac3" :value="form.inverterStatus==6 || form.inverterStatus==7?form.epsCpowerActive?form.epsCpowerActive:0:form.pac3"><label>W</label>
                                    </td>							
								</tr>
							</table>
						</fieldset>
					</div>
                    <!--电池信息-->
                    <div v-show="type.battery!=0">
                        
                        <div id="batteryImg" class="real-img batteryImg">
                            <img src="../../assets/img/realtime/battery.png">
                        </div>
                        <div id="box-battery-info">
                            <fieldset class="modal-set-info battery-file line-right">
                                <legend>{{$t('devicd.display.Battery')}}</legend>
                                <table>
                                    <tbody>
                                        <tr>
                                            <td><div class="td-label">{{$t('device.inverter_BMS_Lost')}}</div></td>
                                            <td class="input-right" id="bms_lost">
                                                <img class="bms-icon" :src="bms_icon">
                                            </td>
                                        </tr>
                                        <tr>
                                            <td><div class="td-label">{{$t('device.inverter_real_time.batVoltage')}}</div></td>
                                            <td class="input-right">
                                                <input readonly id="batVoltage1" name="batVoltage1" :value="form.batVoltage1"><label>V</label>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td><div class="td-label">{{$t('device.inverter_real_time.batCurrent')}}</div></td>
                                            <td class="input-right">
                                                <input readonly id="batCurrent1" name="batCurrent1" :value="form.batCurrent1"><label>A</label>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td><div class="td-label">{{$t('device.inverter_real_time.batPower')}}</div></td>
                                            <td class="input-right">
                                                <input readonly id="batPower1" name="batPower1" :value="form.batPower1"><label>W</label>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td><div class="td-label">{{$t('Battery_SoC')}}</div></td>
                                            <td class="input-right">
                                                <input readonly id="batteryCapacity" name="batteryCapacity" :value="form.batteryCapacity"><label>%</label>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </fieldset>
                        </div>
                    </div>
					
					
					<!-- 电表start -->
                    <div v-show="visible_meter">
                        <div id="meterImg" class="real-img meterImg">
                            <img src="../../assets/img/realtime/meter.png">
                        </div>
                        <div id="box-ammeter-info">
                            <fieldset class="modal-set-info ammeter-file line-top"><legend>{{$t('devicd.display.Generation')}}</legend>
                                <table>
                                    <tbody>
                                        <tr>
                                            <td><div class="td-label">{{$t('batteryAnalysis.p_change')}}</div></td>
                                            <td class="input-right">
                                                <input readonly id="feedinPowerMeter2" name="feedinPowerMeter2" :value="form.feedinPowerMeter2"><label>W</label>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </fieldset>
                        </div>
                    </div>
					<!-- 电表end -->
					
					<!-- 并网功率 -->
					<fieldset class="modal-set-info ca-tbl-one line-left" v-show="type.inverterType!=13&&visible1">
                        <legend>{{$t('devicd.display.Grid')}}</legend>
						<table>
							<tr>
								<td><div class="td-label">{{$t('test.deviceTest.real_time.feedInPower')}}</div></td>
								<td class="input-right">
                                    <input readonly id="feedinpower" :value="calc.feedinpower"><label>W</label>
                                </td>
							</tr>
						</table>
					</fieldset>
					<!-- 并网功率1 2 -->
					<fieldset class="modal-set-info ca-tbl-one line-left" :class="type.inverterType==13?'japan':''" v-show="type.inverterType==13">
                        <legend>{{$t('devicd.display.Grid')}}</legend>
						<table>
							<tr>
								<td><div class="td-label">{{$t('test.deviceTest.real_time.feedInPower')}}{{$t('1')}}</div></td>
								<td class="input-right">
                                    <input readonly id="feedinpower1" :value="form.feedinpower1"><label>W</label>
                                </td>
							</tr>
							<tr>
								<td><div class="td-label">{{$t('test.deviceTest.real_time.feedInPower')}}{{$t('2')}}</div></td>
								<td class="input-right">
                                    <input readonly id="feedinpower2" :value="form.feedinpower2"><label>W</label>
                                </td>
							</tr>
						</table>
					</fieldset>
					
					<!-- 负载 -->
					<fieldset class="modal-set-info ca-tbl-two line-left" v-show="visible1">
                        <legend>{{$t('devicd.display.Load')}}</legend>
						<table>
							<tbody>
								<tr>
									<td><div class="td-label">{{$t('device.total_load_power')}}</div></td>
									<td class="input-right">
                                        <input readonly id="totalloadpower" :value="calc.totalloadpower"><label>W</label>
                                    </td>
								</tr>
							</tbody>
						</table>
					</fieldset>
					
					<!-- 总发电量 -->
					<div class="box-right-two" id="yieldtotalDiv">
						<table style="width: 100%;">
							<tbody>
								<tr>
									<td style="text-align: center;font-size:15px;line-height: 25px;">
                                        <span class="cap-size" name="yieldtotal">
                                            {{form.yieldtotal | numberFloatFrm(true) | getByIndex(0)}}
                                            {{form.yieldtotal | numberFloatFrm(true) | getByIndex(1)}}
                                        </span>
                                    </td>
								</tr>
								<tr>
									<td style="text-align: center;line-height: 23px;white-space: nowrap;">
                                        {{$t('test.deviceTest.real_time.totalYield')}}
                                    </td>
								</tr>
							</tbody>
						</table>
					</div>
					<!-- 日发电量 -->
					<div class="box-right-one" id="yieldtodayDiv">
						<table style="width: 100%;">
							<tbody>
								<tr>
									<td style="text-align: center;font-size:15px;line-height: 25px;">
                                        <span class="cap-size" name="yieldtoday">
                                            {{form.yieldtoday | numberFloatFrm(true) | getByIndex(0)}}
                                            {{form.yieldtoday | numberFloatFrm(true) | getByIndex(1)}}
                                        </span>
                                    </td>
								</tr>
								<tr>
									<td style="text-align: center;line-height: 23px;">
                                        {{$t('index.todayYield')}}
                                    </td>
								</tr>
							</tbody>
						</table>
					</div>
					<!-- 并网功率(日本机显示)-->
					<div class="box-right-one janpan" v-show="type.inverterType==13">
						<table style="width: 100%;">
							<tbody>
								<tr>
									<td style="text-align: center;font-size:15px;line-height: 25px;">
                                        <span class="cap-size" name="feedinpower">{{form.feedinpower}}</span>
                                    </td>
								</tr>
								<tr>
									<td style="text-align: center;line-height: 23px;">
                                        {{$t('test.deviceTest.real_time.feedInPower')}}
                                    </td>
								</tr>
							</tbody>
						</table>
					</div>
					<!-- 逆变器输入功率 -->
					<div class="box-right-one" v-show="form.gridpower!=null&&form.gridpower!=''">
						<table style="width: 100%;">
							<tbody>
								<tr>
									<td style="text-align: center;font-size:15px;line-height: 25px;">
                                        <span class="cap-size" name="gridpower">{{form.gridpower}}</span>
                                    </td>
								</tr>
								<tr>
									<td style="text-align: center;line-height: 23px;">
                                       {{$t('device.inverter_real_time.pac')}} 
                                    </td>
								</tr>
							</tbody>
						</table>
					</div>
				</div>
			</div>
		</form>

        <pvDetailModal :visiblePv.sync='visiblePv' :pvDetailData='pvDetailData' :pvDetailDataType='pvDetailDataType'></pvDetailModal>
    </div>
</template>

<script>
import pvDetailModal from './pvDetailModal'
export default {
    components: {
        pvDetailModal
    },  
    data() {
        return {
            inverterSN:sessionStorage.getItem("selRow_inverter_sn"),
            wifiSn:sessionStorage.getItem('selRow_wifi_sn'),
            snType:sessionStorage.getItem('selRow_sn_type'),
            inverterType:sessionStorage.getItem('selRow_inverterType'),
            phaseType:sessionStorage.getItem('selRow_phase_type'),//1单相  3三相
            batteryType:sessionStorage.getItem('selRow_battery_type'),
            // inverterTypes:getDictionary("INVERTER_TYPES",lan),
            loadType:sessionStorage.getItem("selRow_load_type"),
            lan:localStorage.getItem('language'),
            currentTime:this.$options.filters['dateFormat'](new Date()),
            form:{//form数据
                vdc1:'2',
                idc1:'4'
            },
            type:{
                battery:0,//是否显示电池   battery:0无电池  1有电池
                pvCount:0,//pvCount:pv个数  2||4
                inverterType:'',//inverterType==13 日本机
            },
            pv1Num:'',
            pv2Num:'',
            visible1:false,
            visible_meter:false,
            visiblePv:false,
            calc:{//计算出的值
                totalloadpower:'',
                batPower1:'',
                feedinPowerMeter2:'',
                gridpower:'',
                wMachineStyle:null
            },
            gif:{
                pv:'',
                battery:'',
                meter:'',
                grid1:'',
                grid2:'',
                load:''
            },
            pv_gif:false,
            battery_gif:false,
            meter_gif:false,
            grid_gif_1:false,
            grid_gif_2:false,
            load_gif:false,
            bms_icon:'',
            timer:null,//定时器,
            japanDataList:{},
            pvDetailData:{},
            pvDetailDataType:{},
            inverterTypeData:[]
        };
    },
    computed: {
        
    },
    watch: {
    },
    created() {

    },
    mounted() {
        this.getTypeModelBySN()//获取机型
        this.getPVBySNAndModuleId()//获取pv个数
    },
    methods: {
        inverterStatusFormatter(inverterStatus) {
            var result='-';
            this.inverterTypeData.forEach(obj=>{
                if(obj.value == inverterStatus){
                    result = obj.code;
                }
            })
            return result;
        },
        async getDictionaryBatch(inverterType){
            let res = await this.API.getDictionaryBatch({
                dictCodes:'BATTERY_RUN_STATUS,'+'INVERTER_STATUS_'+inverterType,
                lang:localStorage.getItem('lang')
            })
            this.inverterTypeData = res['INVERTER_STATUS_'+inverterType]
            this.batteryStatusData = res['BATTERY_RUN_STATUS']
        },
        showPvModal(form,type){
            this.pvDetailData = form
            this.pvDetailDataType = type
            this.visiblePv = true
        },
        initPage(){
            console.log("刷新-real-time-display-")
            this.getInverterFromRedis()
            this.getPVBySNAndModuleId()//获取pv个数
        },
        //获取机型
        async getTypeModelBySN(){
            let res=await this.API.getTypeModelBySN({
                inverterSN:this.inverterSN
            })
            console.log(res,'获取机型-real-time-display')
            this.type=res
            this.phaseType=res.phaseFlag
            this.getInverterFromRedis()
        },
        //获取pv个数
        async getPVBySNAndModuleId(){
            let res=await this.API.getPVBySNAndModuleId({
                SN:this.inverterSN
            })
            if(res.length>0){
                this.pv1Num = res[0].pv1Num === null? '': res[0].pv1Num
                this.pv2Num = res[0].pv2Num === null? '': res[0].pv2Num
            }else{
                this.pv1Num = ''
                this.pv2Num = ''
            }
        },
        //获取form数据
        async getInverterFromRedis(){
            let data=await this.API.getInverterFromRedis({
                inverterSN:this.inverterSN,
                wifiSN:this.wifiSn,
                currentTime:this.currentTime
            })
            this.japanDataList = data
            console.log(data)
			if(data.yieldtotal!=null){
				// data.yieldtotal=numberUnit(parseFloat(data.yieldtotal).toFixed(2));
            }
            var meter1Falg=false;//判断是否有电表1
            if((data.feedinpower!=null  && data.feedinpower!=0 )|| 
               (data.feedinenergy!=null && data.feedinenergy != 0)|| 
               (data.consumeenergy!=null && data.consumeenergy != 0)){
                this.calc.feedinpower=Math.abs( parseFloat(data.feedinpower).toFixed(2) )
                this.visible1=true
                meter1Falg=true;
			}else{
                this.visible1=false
                meter1Falg=false;
			}
			if(data.gridpower!=null && data.feedinpower!=null){
                this.calc.totalloadpower=Math.abs( parseFloat(data.gridpower+ data.epspower+ data.feedinPowerMeter2- data.feedinpower).toFixed(2) )
            }
            console.log(data.pac1,'data.pac1')
            console.log(data.gridpower,'data.gridpower')
            console.log(this.phaseType,'phaseType')
            if(this.phaseType==1){
				data.pac1=data.gridpower;
            }

            //是否显示电表
			if(data.meter2ComState==1){
                this.visible_meter=true
			}else{
                this.visible_meter=false
			}

            //流动图---
			//pv功率
			if(data.powerdc1 + data.powerdc2 + data.powerdc3 + data.powerdc4 > 0){
                this.gif.pv=true
			}else{
                this.gif.pv=false
            }
            //电池功率
            if(data.dataReference==1&&data.bmslost==0){
                this.gif.battery=data.bmsBatPower
                data.batPower1=data.bmsBatPower
            }else{
                this.gif.battery=data.batPower1
            }

            //发电机流向
			if(data.meter2ComState==1){
                this.gif.meter = data.feedinPowerMeter2
            }

            //逆变器(gridpower)和并网功率(feedinpower)
            this.gif.grid1=data.gridpower
            this.gif.grid2=data.feedinpower
			
			var totalloadpower = parseFloat(data.gridpower+data.feedinPowerMeter2-data.feedinpower).toFixed(2);
            //没有电表的时候显示负载流向，但是当逆变器停止运行，隔壁负载流向

            //当没有电表时：逆变器功率为正，流动同时从逆变器向电网和负载；逆变器功率为负，流动从电网到逆变器，负载没有；逆变器功率为0，没有流动
            this.gif.load=totalloadpower
            // data.inverterStatus = 7
            this.getDictionaryBatch(data.inverterStatus)
            if(!meter1Falg){
                if(data.inverterStatus == 6 || data.inverterStatus == 7){
                    if(data.epspower > 0){
                        this.gif.load=1;
                        this.gif.grid1=1
                        this.gif.grid2=0
                    }else if(data.epspower < 0){
                        this.gif.load=1;
                        this.gif.grid1=1
                        this.gif.grid2=0
                    }else{
                        this.gif.load=0;
                        this.gif.grid1=0
                        this.gif.grid2=0
                    }
                    
                }else{
                    if(data.gridpower > 0){
                        this.gif.load=1;
                        this.gif.grid1=1
                        this.gif.grid2=1
                    }else if(data.gridpower < 0){
                        this.gif.load=0;
                        this.gif.grid1=-1
                        this.gif.grid2=-1
                    }else{
                        this.gif.load=0;
                        this.gif.grid1=0
                        this.gif.grid2=0
                    }
                }
            }else{
                if(data.inverterStatus == 6 || data.inverterStatus == 7){
                    if(data.epspower > 0){
                        this.gif.load=1;
                        this.gif.grid1=1
                        this.gif.grid2=0
                    }else if(data.epspower < 0){
                        this.gif.load=-1;
                        this.gif.grid1=-1
                        this.gif.grid2=0
                    }else{
                        this.gif.load=0;
                        this.gif.grid1=0
                        this.gif.grid2=0
                    }
                }
                if(data.feedinPowerMeter2!=null && data.feedinPowerMeter2 != 0){
                    //显示发电机
                    this.visible_meter=true
                    this.gif.meter = data.feedinPowerMeter2
                }else{
                    //隐藏发电机
                    this.visible_meter=false
                    this.gif.meter=0
                }
            }
            
            //控制显示pv
            
            this.calc.wMachineStyle=data.wMachineStyle
			if(data.wMachineStyle==1){
				//隐藏pv模块
                this.gif.pv=false
            }
            //逆变器输出功率
            if(data.inverterStatus == 6 || data.inverterStatus == 7){
                if(data.epspower != null){
                    data.gridpower = parseFloat(data.epspower).toFixed(2)+'W';
                }
            }else{
                if(data.gridpower != null){
                    data.gridpower = parseFloat(data.gridpower).toFixed(2)+'W';
                }
            }   
			//并网功率
			if(data.feedinpower != null){
				data.feedinpower = parseFloat(data.feedinpower).toFixed(2)+'W';
            }
            console.log('form-1',this.form.gridpower)
            var data_abs={};
            for(let key in data){
                if(typeof data[key] == "number"){
                    data_abs[key]=Math.abs(data[key]);
				}else{
					data_abs[key]=data[key];
				}
            }
            

            //若dataReference=1，电池显示BMS信息
			// if(data.dataReference==1){
			// 	data_abs.batVoltage1=data_abs.bmsBatVoltage;
			// 	data_abs.batCurrent1=data_abs.bmsBatCurrent;
			// 	data_abs.batPower1=data_abs.bmsBatPower;
			// }
            console.log('form-2',this.form.gridpower)
            this.form=data_abs//赋值给表格
            console.log('form-3',this.form.gridpower)
			if(this.batteryType==1){//电池状态存在的时候再考虑bms
                if(data.bmslost==0){//0为正常
                    this.bms_icon=require('../../assets/img/realtime/icon-on.png')
				}else{
                    this.bms_icon=require('../../assets/img/realtime/icon-off.png')
                }
			}
			
            var datenow=new Date().getTime();
			var pwdtime=new Date(data.uploadTimeValue).getTime();
			var time=datenow-pwdtime;
			if(time>3*24*3600*1000){
				for(let key in this.form){
                    if(key!='yieldtotal'&&key!='feedinpower'&&key!='gridpower'&&key!='yieldtotal'&&key!='inverterStatus'){
                        this.form[key]=0
                    }
                }
                this.calc.feedinpower=0
                this.calc.totalloadpower=0
                for(let key in this.gif){
                    this.gif[key]=0
                }
			}
        }
    },
};
</script>

<style  lang="less" scoped>
.real-time-display{
    background: #fff;
    .inverter-status-box{
        font-size: 20px;
        margin-left: 20px;
        font-weight: 700;
        color: #555;
    }
    body{
        min-width:1000px;
    }

    .content {
        padding: 0px;
        padding-top: 50px;
    }

    input {
        border: none;
    }
    .unit-info{
        display: inline-block;
        margin-top: 5px;
        margin-left: 5px;
        }

    .col-sm-5 span,.col-sm-6 span {
        display: inline-block;
        width: 100%;
        height: 30px;
        padding: 7px;
        background: #333;
    }
    .detail-pv-modal-show{
        color: #FB870F;
        float: right;
    }
    .modal-set-info{
        width: max-content;
        padding:0 5px 3px;
        border: 1px dashed #CBCBCB;
    }
    .modal-set-info legend{
        width:auto;
        padding:0 5px;
        color: #FB870F;
        font-size: 12px;
        white-space: nowrap;
    }
    .modal-set-info::before {
        content: "";
        position: absolute;
    }
    .modal-set-info.line-left::before{
        left: -36px;
        top: 52%;
        width: 35px;
        border-top: 1px dashed #bdbdbd;
    }
    .modal-set-info.line-right::before{
        right:-36px;
        top: 52%;
        width: 35px;
        border-top: 1px dashed #bdbdbd;
    }
    .modal-set-info.line-top::before{
        top: -36px;
        left: 50%;
        height: 35px;
        border-left: 1px dashed #bdbdbd;
    }
    .modal-set-info.line-bottom::before{
        bottom: -36px;
        left: 50%;
        height: 35px;
        border-left: 1px dashed #bdbdbd;
    }


    .modal-set-info tbody{
        border:0px;
        line-height: 25px;
    }
    .modal-set-info tr{
        border:0px;
    }
    .modal-set-info td{
        position: relative;
        // height: 30px;
        border: 0px;
        color: #5c5c5c;
        font-size: 12px;
        line-height: 15px;
        padding: 2px 0px;
    }
    .input-right{    
        width: 75px;
    }

    // .input-right input{
    //     position: absolute;
    //     left: 5px;
    //     top: 2px;
    // }

    table{
        margin: 0px auto;
    }
    td input{
        display: inline-block;
        background-color: #EDEDED;
        border-radius: 2px;
        padding-left: 3px;
        color: #FB870F;
        width: 75px;
        border: 1px solid #DADADA;
        line-height: 17px;
    }
    td label{
        display: inline-block;
        position: absolute;
        right: 5px;
        top: 3px;
        text-align: right;
        line-height: 18px;
        color: #afaeae;
    }
    .modal-box-6,.modal-box-12{
        display: inline-block;
    }
    .modal-box-6{
        float:left;
        width: 500px;
    }
    .modal-box-12{
        width:100%;
        height: 180px;
    }
    .modal-content-picshow{
        clear: both;
        width: 1000px;    
        height: 566px;
        margin: 0px auto;
        margin-top: 30px;
        border-radius:10px;
        background:url(../../assets/img/realtime/real-time-new.png) no-repeat;
        background-size: 100%;
        /* background-position: center; */
        background-position: 18px 126px;
    }

    .modal-set-info .leg-circle{
        padding: 0px;
        color: #cbcbcb;
        width: 16px;
        margin-left: -16px;
        font-size: 25px;
        background: #ededed;
    }

    .cap-size{
        font-size: 16px;
        color: #FB870F;
    }
    .pv-file-one {
        display: inline-block;
        position: absolute;
        top: 150px;
        left: -100px;
    }
    .pv-file-one table:not(:last-child){
        margin-bottom: 5px;
    }
    
    .main-file-one{
        position: absolute;
        top: 61px;
        left: 356px;
    }

    .main-file-two{
        position: absolute;
        top: 61px;
        left: 154px;
        &.japan{
            left: 244px;
        }
    }

    .battery-file{
        position: absolute;
        left: 174px;
        top: 333px;
    }

    .ammeter-file{
        position: absolute;
        left: 482px;
        top: 502px;
    }
    .ammter-img{
        position: absolute;
        left: 575px;
        top: 462px;
        transform: rotate(44deg);
        -ms-transform: rotate(44deg);
        -moz-transform: rotate(44deg);
        -webkit-transform: rotate(44deg);
        -o-transform: rotate(44deg);
    }

    .ca-tbl-one{
        position: absolute;
        top: 229px;
        left: 931px;
        &.japan{
            top: 219px;
        }
    }

    .ca-tbl-two{      
        position: absolute;
        top: 392px;
        left: 817px;
    }

    .ca-tbl-three{    
        position: absolute;
        left: 275px;
        top: -3px;
    }

    .eps-file-one{
        position: absolute;
        width: 172px;
        left: 695px;
        top: 310px;
    }

    .eps-file-two{
        position: absolute;
        width: 172px;
        left: 695px;
        top: 460px;
        padding-top: 5px;
    }

    .box-right-one,.box-right-two{
        float: right;
        margin: 0 10px;
        margin-top: -30px;
        padding: 4px 15px;
        min-width: 120px;
        background: url(../../assets/img/realtime/box.png) no-repeat;
        background-size: 100% 100%;
    }

    .pv-img-one{
        position: absolute;
        left: 140px;
        top: 162px;
    }

    .pv-img-two {
        position: absolute;
        left: 66px;
        top: 235px;
        transform: rotate(133deg);
        -ms-transform: rotate(133deg);
        -moz-transform: rotate(133deg);
        -webkit-transform: rotate(133deg);
    }

    .mains-img{
        position: absolute;
        left: 445px;
        top: 158px;
        transform: rotate(44deg);
        -ms-transform: rotate(44deg);
        -moz-transform: rotate(44deg);
        -webkit-transform: rotate(44deg);
        -o-transform: rotate(44deg);
    }

    .move-gif-pv{
        width: 140px;
        position: absolute;
        left: 246px;
        top: 246px;
    }

    .move-gif-mains{
        width: 140px;
        position: absolute;
        left: 532px;
        top: 248px;
    }
    .move-gif-mains-back{
        width: 140px;
        position: absolute;
        left: 532px;
        top: 248px;
        transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        -o-transform: rotate(180deg);
    }

    .move-gif-battery{
        width: 120px;
        position: absolute;
        left: 392px;
        top: 365px;
        transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -webkit-transform: rotate(90deg);
        -o-transform: rotate(90deg);
    }

    .move-gif-eps{
        width: 140px;
        position: absolute;
        left: 530px;
        top: 352px;
        transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -webkit-transform: rotate(90deg);
        -o-transform: rotate(90deg);
    }

    .power-gif{
        // display: none;//初始化全部不显示
        position: absolute;
        height: 13px;
        background: url(../../assets/img/realtime/move3.gif) no-repeat;
        background-size: auto 100%;
        border-radius: 25px;
        z-index: 2;
    }

    .pv-gif{
        left: 270px;
        top: 248px;
        width: 120px;
    }
    .battery-gif{
        left: 441px;
        top: 329px;
        width: 44px;
        transform: rotate(90deg);
    }
    .meter-gif{
        left: 574px;
        top: 305px;
        width: 109px;
        transform: rotate(120deg);
    }
    .battery-gif.up{
        transform: rotate(-90deg);
    }
    .meter-gif.up{
        transform: rotate(-60deg);
    }

    .grid-gif-all,
    .grid-gif-1,
    .grid-gif-2{
        left: 544px;
        top: 248px;
        width: 326px;
    }
    .grid-gif-all{
        display:none;
        width: 238px;
    }
    .grid-gif-1{
        width: 116px;
    }

    .grid-gif-2{
        left: 660px;
        width: 116px;
    }
    .grid-gif-1.left,
    .grid-gif-2.left{
        /* transform: rotate(180deg); */
        transform: scaleX(-1);
    }
    .load-gif{
        left: 636px;
        top: 304px;
        width: 110px;
        transform: rotate(60deg);
    }
    .load-gif.up{
        transform: rotate(-120deg);
    }


    .battery-img{
        position: absolute;
        left: 380px;
        top: 413px;
        z-index: -1;
        transform: rotate(133deg);
        -ms-transform: rotate(133deg);
        -moz-transform: rotate(133deg);
        -webkit-transform: rotate(133deg);
        -o-transform: rotate(133deg);
    }

    .eps-img-one{
        position: absolute;
        left: 615px;
        top: 353px;
        transform: rotate(133deg);
        -ms-transform: rotate(133deg);
        -moz-transform: rotate(133deg);
        -webkit-transform: rotate(133deg);
        -o-transform: rotate(133deg);
    }

    .eps-img-two{
        position: absolute;
        left: 655px;
        top: 353px;
        transform: rotate(133deg);
        -ms-transform: rotate(133deg);
        -moz-transform: rotate(133deg);
        -webkit-transform: rotate(133deg);
        -o-transform: rotate(133deg);
    }

    .relay-img{
        position: absolute;
        left: 655px;
        top: 477px;
        transform: rotate(133deg);
        -ms-transform: rotate(133deg);
        -moz-transform: rotate(133deg);
        -webkit-transform: rotate(133deg);
        -o-transform: rotate(133deg);
    }
    .cover-span{
        position: absolute;
        width: 115px;
        height: 400px;
        left: 395px;
        top: 300px;
        font-size: 49px;
        background-color: #fff;
    }
    .bms-status{
        width: 115px;
        height: 400px;
        left: 395px;
        top: 300px;
    }
    .ammeter-status{
        width: 153px;
        height: 400px;
        left: 513px;
        top: 285px;
    }

    .bms-lost-info{
        margin-left:8px;
    }
    .td-label{
        position:relative;
        width: 100px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .real-img{
        position: absolute;
        z-index:1;
    }
    .real-img img{
        width:73.1%;
    }
    .pvImg{
        position: absolute;
        top: 199px;
        left: 144px;
    }
    .meterImg{
        position: absolute;
        top: 254px;
        left: 540px;
    }
    .batteryImg{
        position: absolute;
        top: 305px;
        left: 410px;
    }
    .modal-content-picshow.noPv{
        transform: translate(-150px);
    }
    .real-line{
        z-index:0;
    }

    .modal-content-picshow{
        width: 900px; 
        background-position: 68px 135px;
        transform: translateX(-67px);
    }
    .pv-img-two {
        left: 116px;
    }
    .pv-file-one {
        left: -100px;
    }
    .box-right-one {
        left: 670px;
    }
    .box-right-two{
        left: 840px;
    }
    .box-pv-4{
        top:60px;
        &.pv3{
            top:100px;
        }
    }
    .bms-icon{
        padding-left:5px;
        height: 15px;
        vertical-align: middle;
    }
    .prompt{
        margin: 0 20px;
        position: absolute;
        top: 347px;
        left: 809px;
        color: #FB870F;
        font-size: 25px;
    }
    .tooltip-inner{
        width:247px;
    }

    .main-file-two table{
        float:left;
        margin-right: 10px;
    }
}
</style>
